<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>aaaa</h1>
    <div id="one">
        <i>111</i>
        <u>222</u>
    </div>
    <h3>巴巴爸爸</h3>
    <script>
        // console.log(one.parentNode);//父节点

        // console.log(one.childNodes);//子节点---文本(换行)+标签
        // console.log(one.children);//子元素---标签

        // console.log(one.firstChild);//第一个子节点
        // console.log(one.firstElementChild);//第一个子元素

        // console.log(one.lastChild);//最后一个子节点
        // console.log(one.lastElementChild);//最后一个子元素

        // console.log(one.previousSibling);//上一个子节点
        // console.log(one.previousElementSibling);//上一个子元素

        console.log(one.nextSibling);//下一个子节点
        console.log(one.nextElementSibling);//下一个子元素
       
        //获取1屏的宽度或者高度
        // var html=document.documentElement||document.body;
        // console.log(html.clientWidth);
        // console.log(html.clientHeight);

        //id可以不用查找直接使用
       // console.log(one);

    //    console.log(document.nodeType);
    //    console.log(document.nodeName);
    //    console.log(document.nodeValue);

    //    console.log(one.nodeType);
    //    console.log(one.nodeName);
    //    console.log(one.nodeValue);
    
    </script>
</body>
</html>